<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        html{
            background-color: white;
        }
        body{
            background-color: rgb(35, 187, 43);
        }
.container{
    display: flex;
    flex-wrap: wrap;
    width: 350px;
    height: 350px;
    border: 1px solid black;


}
.a1{
    width: 100px;
    
    text-align: center;
    align-content: center;
    color: blue;
    font: bolder 40px 宋体 ;
}
.square1{
    background-color: rgb(239, 36, 36);
}
.square2{
    background-color: rgb(39, 218, 249);
}
.square3{
    background-color: rgb(92, 223, 10);
}
.square4{
    background-color: rgb(226, 226, 55);
}
.square5{
    background-color: rgb(239, 125, 144);
}
.square6{
    background-color: rgb(250, 192, 83);

}
.square7{
    background-color: rgb(240, 76, 240);
}
.square8{
    background-color: rgb(201, 192, 192);
}
.square9{
    background-color: rgb(110, 55, 55);
}

    </style>
    <script>

    </script>
</head>
<body>
<div class="container">
    <div class="square1 a1">A</div>
    <div class="square2 a1">B</div>
    <div class="square3 a1">C</div>
    <div class="square4 a1">D</div>
    <div class="square5 a1">E</div>
    <div class="square6 a1">F</div>
    <div class="square7 a1">G</div>
    <div class="square8 a1">H</div>
    <div class="square9 a1">I</div>

</div>
<h6>123123</h6> 
</body>
</html>